<template>
	<view>
		<u-no-network @disconnected="disconnected" @connected="connected" @retry="retry"></u-no-network>
		<view class="u-content">
			<view class="u-content__circle">
				<u-icon name="checkbox-mark" color="#fff" size="70"></u-icon>
			</view>
			<text class="u-content__normal">充值成功</text>
		</view>
		<view class="z1">
			<text>正东物业</text>
		</view>
		<view class="z2">
			<text>￥3000</text>
		</view>
		<view class="foot-box" @click="wancheng">
			<text>完成</text>
		</view>

	</view>
</template>

<script>
	export default {
		methods: {
			disconnected() {
				console.log('disconnected');
			},
			connected() {
				console.log('connected');
			},
			retry() {
				console.log('retry');
			},
			wancheng() {
				uni.reLaunch({
					url: '../index/index'
				})
			},
		},
	}
</script>

<style lang="scss" scoped>
	.z1 {
		text-align: center;
		margin-top: 70rpx;
	}

	.z2 {
		text-align: center;
		font-size: 60rpx;
		margin-top: 30rpx;
	}

	.u-content {
		padding: 40px 60px 0;
		@include flex(column);
		align-items: center;
		justify-content: center;

		&__circle {
			background-color: $u-success;
			@include flex;
			border-radius: 100px;
			width: 90px;
			height: 90px;
			align-items: center;
			justify-content: center;
		}

		&__normal {
			font-size: 19px;
			color: $u-success;
			margin-top: 15px;
		}
	}

	.zfje {
		margin-top: 40px;
	}

	.foot-box {
		width: 430rpx;
		height: 100rpx;
		background-color: #e7e7e7;
		border-radius: 10px;
		margin-top: 180px;
		margin-left: 80px;
		color: #77C347;
		font-size: 40rpx;
		line-height: 100rpx;
		text-align: center;
	}

	.foot-box1 {
		width: 430rpx;
		height: 100rpx;
		margin-left: 80px;
		color: #666666;
		font-size: 40rpx;
		line-height: 100rpx;
		text-align: center;
	}
</style>
